<template>
	<view class="content">
		<view class="content1">
			<view class="title">手机号</view>
			<input class="uni-input" focus placeholder="请输入手机号" />
		</view>
		<view class="title">验证码</view>
		<view class="container">
		<input class="left-view" focus placeholder="请输入验证码" /> <button class="right-view" type="primary">发送验证码</button>
		</view>
		<view class="title">新密码</view>
		<input class="uni-input" focus placeholder="请输入新密码" />
		<button class="button1" type="primary" @click="goresetsuccess">确认</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
			},
			methods: {
				goresetsuccess(){
					uni.navigateTo({
						url:"/pages/reset-success/reset-success"
					})
				}
			}
		
	}
</script>

<style lang="scss">
	.content {
		padding: 150rpx 30rpx;
		background-color: rgb(247, 247, 247);
	}

	.uni-input {
		padding-left: 10px;
		font-size: 14px;
		height: 46px;
		width: 100%;
		background-color: rgb(255, 255, 255);
		border-radius: 30rpx;
	}
	.container {
			display: flex;
			justify-content: space-between;
			
		}
	 
		
.left-view{
	padding-left: 10px;
	font-size: 14px;
	height: 46px;
	width: 70%;
	background-color: rgb(255, 255, 255);
	border-radius: 30rpx;
}
	.right-view{
		
		text-align: center;
		height: 46px;
		width: 30%;
		border-radius: 50rpx;
	}

	.title {
		margin: 30rpx 0;
		font-size: 18px;
		font-weight: bold;
	}

	.content1 {
		margin: 50rpx 0;
	}
	.button1{
		margin-top: 200px;
		height: 46px;
		width: 310px;
		text-align: center;
		border-radius: 50rpx;
	}
</style>